const sass = require('sass')
const loadNpmTasks = require('load-grunt-tasks') // 加载所有grunt依赖

var lrSnippet = require('connect-livereload')({port:35729});
var serveStatic = require('serve-static'); //加载serve-static模块,设置静态文件服务器的路径
var serveIndex = require('serve-index');//加载serve-index模块,启用目录浏览

module.exports = grunt => {
  grunt.initConfig({
    clean: {
      temp: 'temp/**',
      dist: 'dist/**'
    },
    sass: {
      options: {
        implementation: sass
      },
      main: {
        // files: {
        //   'temp/assets/styles/*.css': 'src/assets/styles/*.scss'
        // }
        files: [{
          expand: true,
          cwd: 'src/assets/styles/',
          src: ['*.scss'],
          dest: 'temp/assets/styles/',
          ext: '.css'
        }]
      }
    },
    babel: {
      options: {
        presets: ['@babel/preset-env']
      },
      main: {
        files: [{
          expand: true,
          cwd: 'src/assets/scripts/',
          src: ['*.js'],
          dest: 'temp/assets/scripts/',
          ext: '.js'
        }]
      }
    },
    watch: {
      js: {
        files: ['src/assets/scripts/*.js'],
        tasks: ['babel']
      },
      css: {
        files: ['src/assets/scripts/*.scss'],
        tasks: ['sass']
      }
    },
    connect:{
      dist:{
          options:{
              port:9001,
              base:'temp',
              open:true,
              middleware:function (connect) {
                  return [
                     // 把脚本，注入到静态文件中
                     lrSnippet,
                     // 静态文件服务器的路径
                     serveStatic('temp'),
                     // 启用目录浏览(相当于IIS中的目录浏览)
                     serveIndex('temp')
                  ];

              }
          }
      }
  }
  })

  // 清除任务
  // grunt.loadNpmTasks('grunt-contrib-clean')

  // scss->css
  // grunt.loadNpmTasks('grunt-sass')
  loadNpmTasks(grunt)


  // 也可以在任务函数中执行其他任务
  grunt.registerTask('default', ['clean', 'sass', 'babel', 'connect', 'watch'])
}